<script setup>
import { ref } from 'vue'
import axios from "axios";
import router from "@/router";
const input = ref('')
const input2 = ref('')
const input3 = ref('')
const changePassword = () => {
  if (input.value === '' || input2.value === '' || input3.value === '') {
    alert('请输入完整信息')
  } else if (input.value!==localStorage.getItem('password')){
    alert('旧密码错误')
  } else if (input2.value !== input3.value) {
    alert('两次密码不一致')
  } else {
    axios.put("/consultant/updatePassword",{
      consultantId:localStorage.getItem('consultantId'),
      password:input2.value
    },{
      headers: {
        "Content-Type":"multipart/form-data"
      }
    })
        .then(res=>{
          console.log("res")
          console.log(res)
          if (res.data.code==200){
            alert("修改成功")
            router.push("/login")
          }else {
            alert("修改失败")
          }
        })
        .catch(err=>{
          alert("修改失败")
        })
  }
}
const deleteInput = () => {
  input.value = ''
  input2.value = ''
  input3.value = ''
}
</script>

<template>
  <div>
    <ul>
      <li class="box">
        <span>旧密码：</span>
        <el-input v-model="input" style="width: 240px" placeholder="Please input" class="input"/>
      </li>
      <li class="box">
        <span>新密码：</span>
        <el-input v-model="input2" style="width: 240px" placeholder="Please input" class="input"/>
      </li>
      <li class="box">
        <span>确认密码：</span>
        <el-input v-model="input3" style="width: 240px" placeholder="Please input" class="input"/>
      </li>
      <li class="box">
        <el-button type="success" @click="changePassword()">保存</el-button>
        <el-button type="danger" @click="deleteInput">删除</el-button>
      </li>
    </ul>
  </div>
</template>

<style scoped>
ul{
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  margin-top: 20px;
}
.box{
  margin: 15px auto;
  line-height: 32px;
  padding: 10px 0;
}
.box span{
  margin-right: 40px;
  float: left;
}
.input{
  float: right;
}
</style>